<template>
  <div class="serve">
    <!-- 头部 -->
    <HeadPersonal></HeadPersonal>

    <!-- register -->
    <div class="register">
      <!-- registerOne -->
      <div class="registerOne">
        <div class="block">
          <div class="registerOneC">
            <div class="registerOneCNPC">
              <div class="registerOneCNPCNS">
                <p>1</p>
                <h4>填写手机号</h4>
              </div>
              <div class="registerOneCNPCNS">
                <p>2</p>
                <h4>输入密码</h4>
              </div>
              <div class="registerOneCNPCNS">
                <p>3</p>
                <h4>输入邮箱</h4>
              </div>
              <div class="registerOneCNPCNS on">
                <p>4</p>
                <h4>绑定微信</h4>
              </div>
              <div class="registerOneCNPCNS">
                <p>5</p>
                <h4>完成注册</h4>
              </div>
              <div class="clear"></div>
              <div class="registerOneCNPCNhr"></div>
            </div>
            <div class="registerOneCNMOB">
              <p>4</p>
              <h4>绑定微信</h4>
            </div>
            <div class="registerOneCF">
              <div class="registerOneCFM">
                <img src="../../static/images/code1.png" />
                <p>绑定微信以后可以快捷登录</p>
              </div>
              <a class="enrollPwdOneCsub" @click="skip">下一步</a>
              <!-- <input type="submit" value="下一步" class="registerOneCFsub"/> -->
              <span class="registerOneCFsub1" @click="skip">跳过</span>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- 底部 -->
    <HomeHooter></HomeHooter>
  </div>
</template>

<script>
import qs from 'qs';
import $ from "jquery";
import "@/assets/css/home.css";
import "@/assets/css/personal.css";
import HeadPersonal from "@/components/headregister";
import HomeHooter from "@/components/footer";
import md5 from "js-md5";
export default {
  name: "register",
  data() {
    return {};
  },
  components: {
    HeadPersonal,
    HomeHooter
  },
  methods: {
    // 跳过
    skip() {
      var reg = /^1[3|5|7|8]\d{9}$/g;
      if (this.$route.query.phone === "") {
        this.$message({
          message: "请输入手机号",
          type: "warning"
        });
        return false;
      }
      if (!reg.test(this.$route.query.phone)) {
        this.$message({
          message: "请输入正确手机号",
          type: "warning"
        });
        return false;
      }
      if (this.$route.query.code === "") {
        this.$message({
          message: "请输入验证码",
          type: "warning"
        });
        return false;
      }
      if (this.$route.query.password === "") {
        this.$message({
          message: "请输入密码",
          type: "warning"
        });
        return false;
      }
      if (this.$route.query.email === "") {
        this.$message({
          message: "请输入邮箱",
          type: "warning"
        });
        return false;
      }
      // var regs = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
      // if (!regs.test(this.$route.query.email)) {
      //   this.$message({
      //     message: "邮箱格式错误",
      //     type: "warning"
      //   });
      //   return false;
      // }

      let id = this.$axios;
      let params = qs .stringify({
        phone:this.$route.query.phone,
        password:md5(this.$route.query.password),
        email:this.$route.query.email,
        vrifyCode:this.$route.query.code
      });;
      this.$api.member.registerUser(id, params).then(res => {
        let result = res.data;
        if (result.code === 1) {
          this.$message({
            message: result.msg,
            type: "success"
          });
          this.$router.push({ name: "register-registerFive" });
        } else {
          this.$message({
            message: result.msg,
            type: "warning"
          });
        }
      });
    }
  }
};
</script>

<style scoped>
</style>